<html>
	<head>
		<title>{% block title %}{{ application_name }}{% endblock %}</title>
		<link rel="stylesheet" href="/static/css/style.css" type="text/css"/>
		<link rel="stylesheet" href="/static/css/base.css" type="text/css"/>
		<link rel="shortcut icon" href="/static/css/images/favicon.png">
		<script type="text/javascript" src="/static/javascript/prototype.js"></script>
		<script type="text/javascript">	
		function getPages(category_name)
		{
			var div = $('pages');
			if(div==null)
			{
				div = document.createElement('DIV');
			    div.className="window";
			    div.id="pages";    
		    	document.body.appendChild(div);
			}
			div.innerHTML = "<div align='right'><img onclick='closePages()' src='/static/css/images/close.png'></div><center><img src='/static/css/images/loading_anim.gif'/>Loading Pages...</center>"
			new Ajax.Request('/getPages',			
					 {
						method:'get',
						parameters: {category_name: category_name},						
						onSuccess: function(response)
						{
		                    showPages(response.responseText,category_name);
						}
					});
		}

		function showPages(content,category_name)
		{			
			var div = $('pages');
			div.innerHTML = "<div align='right'><img onclick='closePages()' src='/static/css/images/close.png'></div><ul><b style='text-transform:uppercase;'>"+category_name+"</b>"+content+"</ul>";	    
		}

		function closePages()
		{
			var div = $('pages');
			document.body.removeChild(div);
		}			
		</script>
		{% block head %}{% endblock %}
	</head>
	<body>
		<div class="header"><a href="/"><img src="/static/css/images/logo.png"/></a><p align="right">
		  <a href="http://www.acesurf.org">Acesurf Home</a> |
		  <a href="/">Wiki Home</a> |
		  {% if user %}
            <b>{{ user.nickname }}</b> |
            <a href="{{ logout_url|escape }}">Sign out</a>
          {% else %}
            <a href="{{ login_url|escape }}">Sign in</a>
          {% endif %}		
		</p>
		</div>
		<div class="updates">
		
		Recently Edited/Added pages: {% for page in recentPages %}
			<a href="/pages/{{ page.name }}"><b>{{ page.name }}</b></a> by {{ page.user }} |  
		{% endfor %} <br />
		Recently Comments: {% for comment in recentComments %}
			<a href="/pages/{{ comment.page.name }}"><b>{{ comment.page.name }}</b></a> by {{ comment.user }} |  
		{% endfor %}
		</div>
				
		<div class="left-content">
		<ul>
			[<a class="inf" href="/newPage">New Page</a>] <br />
			{% if isAdmin %}
						[<a class="inf" href="/createCategory">New Space</a>] <br />
			{% endif %}	
			<h4>SPACES</h4>
			{% for category in categories %}
			    <li>{% if isAdmin %}[<a class="inf" href="/removeCategory?category_name={{ category.name }}">Delete Space</a>] {% endif%} <a href="javascript:getPages('{{ category.name }}')">{{ category.name }}</a></li>			    
			{% endfor %}						
		</ul>
		</div>			
		<div class="right-content">		
			{% block body %}{% endblock %}
		</div>
		<div class="footer"><p align="center">In posting content to this site, you automatically agree to the <a href="http://code.google.com/appengine/terms.html" target="_blank">Terms &amp; Conditions</a> and <a href="http://code.google.com/appengine/program_policies.html" target="_blank">Program Policies</a>.<br /> Illegal content and spam will be taken down as quickly as possible and reported to the concerned authorities as required by law.<br />You are ultimately responsible for the content you post, and Acesurf will not take responsibility for your actions.<br /><a href="http://www.acesurf.org">Acesurf</a> &copy; Copyrights 2010</p>

     </div>

     </div>
	</body>
</html>
